/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {
      fontFamily: {
        'primary': ["'Fredoka'", "'Baloo 2'", "'Microsoft YaHei'", "-apple-system", "sans-serif"],
      },
      colors: {
        primary: {
          coral: '#FF6B6B',
          orange: '#FF8E53',
        },
        secondary: {
          turquoise: '#4ECDC4',
          skyBlue: '#44A2FC',
        },
        accent: {
          yellow: '#FFE66D',
          green: '#51CF66',
        },
        background: {
          cream: '#FFFBF0',
          white: '#FFFFFF',
          apricot: '#FFF4E6',
        },
        text: {
          primary: '#2D3748',
          secondary: '#4A5568',
          tertiary: '#718096',
        }
      },
      spacing: {
        'xs': '8px',
        'sm': '16px',
        'md': '24px',
        'lg': '32px',
        'xl': '48px',
        '2xl': '64px',
        '3xl': '96px',
        '4xl': '128px',
      },
      borderRadius: {
        'pill': '50px',
        'card': '32px',
        'input': '24px',
        'small': '16px',
        'circle': '50%',
      },
      boxShadow: {
        'small': '0 4px 8px rgba(45, 55, 72, 0.1)',
        'card': '0 8px 20px rgba(45, 55, 72, 0.12)',
        'cardHover': '0 16px 32px rgba(255, 107, 107, 0.25)',
        'button': '0 8px 24px rgba(255, 107, 107, 0.35)',
        'modal': '0 24px 48px rgba(45, 55, 72, 0.2)',
      },
      animation: {
        'bounce': 'bounce 400ms cubic-bezier(0.34, 1.56, 0.64, 1)',
        'cardHover': 'cardHover 300ms cubic-bezier(0.34, 1.56, 0.64, 1)',
        'success': 'success 800ms cubic-bezier(0.34, 1.56, 0.64, 1)',
      },
      keyframes: {
        cardHover: {
          '0%': { transform: 'translateY(0) rotate(0deg)' },
          '100%': { transform: 'translateY(-16px) rotate(-2deg)' }
        },
        success: {
          '0%': { transform: 'scale(0)' },
          '50%': { transform: 'scale(1.2)' },
          '100%': { transform: 'scale(1)' }
        }
      }
    },
  },
  plugins: [],
}